<template>
  <div v-if="data">
    <a-modal title="申请加库存" :visible="visible" :confirm-loading="confirmLoading" @ok="handleOk" @cancel="handleCancel">
      <div class="m5">产品ID：{{ data.id }}</div>
      <div class="m5">产品名称：{{ data.productName }}</div>
      <div class="m5">站点：{{ data.locationName }}</div>
      <div class="m5">合同库存：{{ data.stockAmountOfContract }}</div>
      <div class="m5">已设库存：{{ data.stockAmountOfProduct }}</div>
      <title-box class="mt20 mb5">增加产品库存</title-box>
      <div class="inventoryPushinfo mb20">（增加库存非库存加推，申请增加库存+已设库存之和不得大于合同库存）</div>
      <div v-if="!data.itemStock">增加产品库存： <a-input v-model="addProductStockAmount" placeholder="请输入库存数量" @input="changeInputValue($event, 'addProductStockAmount')" /></div>

      <div v-if="data.itemStock">
        <div v-for="(item, index) in data.addItemsStockAmount" :key="index">
          <div class="mt10">套餐{{ index + 1 }}: {{ item.itemName }}</div>
          <div class="mt10">增加库存： <a-input v-model="item.addStockAmount" placeholder="请输入库存数量" @change="changeInputValue($event, item)" /></div>
        </div>
      </div>
      <div v-if="data.logs">
        <title-box class="mt20 mb20">增加库存日志</title-box>
        <a-timeline-item v-for="(item, index) in data.logs" :key="index">
          <div class="mb10">
            <span class="pr10"> {{ item.createTime }}</span>
            <a-tag color="#108ee9" v-if="item.auditStatus == 0">
              待审核
            </a-tag>
            <a-tag color="#87d068" v-if="item.auditStatus == 1">
              通过
            </a-tag>
            <a-tag color="#f50" v-if="item.auditStatus == 2">
              驳回
            </a-tag>
            <span v-if="item.auditStatus == 2">驳回原因：{{ item.auditResult }}</span>
          </div>
          <div class="mb10">增加产品库存： {{ item.addProductStockAmount }}</div>
          <div class="mb10">操作人：{{ item.applicantName }}</div>
        </a-timeline-item>
      </div>
    </a-modal>
  </div>
</template>

<script>
import TitleBox from '../../goodsManag/components/detailsTitle'
import { submitApplicationStock } from '@/service'
export default {
  model: {
    prop: 'inventoryPush',
    event: 'change'
  },
  props: {
    inventoryPush: {
      type: Boolean,
      default: false
    },
    productId: {
      type: Number
    },
    data: { type: Object }
  },
  data() {
    return {
      confirmLoading: false,
      addProductStockAmount: null
    }
  },
  computed: {
    visible: {
      get() {
        if (!this.data) return false
        return this.inventoryPush
      },
      set(v) {
        this.$emit('change', v)
      }
    }
  },
  methods: {
    handleCancel() {
      this.visible = false
    },
    async handleOk() {
      await submitApplicationStock({
        addProductStockAmount: this.addProductStockAmount,
        ...this.data
      })
      this.$messageSend.success('成功')
      this.handleCancel()
    },

    changeInputValue(params, key) {
      let { value } = params.target
      const formatValue = Number.parseInt(value, 10) || ''

      const isCheck = formatValue < 1

      if (isCheck) {
        this.$messageSend.warning('增加产品库存不能小于1！')
      }

      if (typeof key === 'string') {
        this[key] = isCheck ? '' : formatValue
      } else {
        this.$set(key, 'addStockAmount', isCheck ? '' : formatValue)
      }

      this.$forceUpdate()
    }
  },
  components: { TitleBox }
}
</script>

<style scoped lang="scss">
.inventoryPushinfo {
  font-size: 12px;
  color: orange;
}
</style>
